<template>
  <div class="morefollow">
    <Navhead labelText="更多跟帖" />
    <maincomment
      :commten="commtens"
      v-for="commtens in commtenData"
      :key="commtens.id"
      @maincomtent="maincomtent"
    />
    <div class="bottom">已经没有更多啦</div>
    <publish
      :publishdata="maindata"
      ref="replycall"
      @loadcomment="loadcomment"
    />
  </div>
</template>

<script>
import publish from "../comment/publish";
import maincomment from "../comment/maincomment";
import Navhead from "@/components/Navhead.vue";
export default {
  components: {
    maincomment,
    Navhead,
    publish,
  },
  data() {
    return {
      commtenData: [],
      maindata: "",
    };
  },
  methods: {
    maincomtent(maindata) {
      this.maindata = maindata;
      this.$refs.replycall.isactivate();
      console.log("传到id了");
    },
    loadcomment() {
      this.loadcommentpage();
    },
    loadcommentpage() {
      this.$axios({
        url: "/post_comment/" + this.$route.params.id,
      }).then((res) => {
        console.log(res);
        this.commtenData = res.data.data;
        // 发送完清数据,不要让他一直是回复那个人
        this.maindata = {};
      });
    },
  },
  mounted() {
    this.loadcommentpage();
  },
};
</script>

<style lang="less" scoped>
.morefollow {
  padding: 7.222vw 4.444vw 7.222vw 5.556vw;
  background-color: #f2f2f2;
  .bottom {
    margin-top: 20px;
    text-align: center;
    color: #888;
  }
}
</style>